import React from "react"
import {Avatar,Divider,Tag,Tooltip} from "antd"
import  {QqOutlined,GithubOutlined,WechatOutlined} from "@ant-design/icons"
import Link from "next/link"
// css
import "../styles/component/author.css"
const Author = ()=>{
    let content =(
        <p className="hover_info">1571795541</p>
    )
    return (
        <div className="author-div comm-box">
            <div>
                <Avatar size={100} src="/static/img/index.jpg"></Avatar>
            </div>
            <div className="author-introduction">
                前端萌新的博客站点
                <div>
                <Tag color="#f50">javascript</Tag>
                <Tag color="#2db7f5">java</Tag>
                <Tag color="#87d068">php</Tag>
                <Tag color="#108ee9">node</Tag>
                 </div>
            <Divider>社交账号</Divider>
           <Link href="https://github.com/skyllove">
                <Avatar size={28} icon={<GithubOutlined />} className="account"/>
                </Link>
            <Tooltip title="1571795541" placement="top">
                <Avatar size={28} icon={<QqOutlined />} className="account"/>
            </Tooltip>
            <Avatar size={28} icon={<WechatOutlined/>} className="account"/>
            </div>
        </div>
    )
}

export default Author